<template>
   <div class="home-less-box" v-bind:style="{height:activityHeight}"></div>
</template>
<style scoped>
.home-less-box {
  height: 100%;
  background-position: center center;
  background-size: cover;
  background-image: url("../../assets/img/login.jpg");
  background-repeat: no-repeat;
}
</style>
<script>
export default {
  name: "main",
  data() {
    return {
      activityHeight: "0px"
    };
  },
  methods: {
    makeHeight() {
      let winHeight = 0;
      let _this = this;

      if (window.innerHeight) winHeight = window.innerHeight;
      else if (document.body && document.body.clientHeight)
        winHeight = document.body.clientHeight;
      // 通过深入 Document 内部对 body 进行检测，获取窗口大小
      if (
        document.documentElement &&
        document.documentElement.clientHeight &&
        document.documentElement.clientWidth
      ) {
        winHeight = document.documentElement.clientHeight;
        // winWidth = document.documentElement.clientWidth;
      }

      _this.activityHeight = winHeight - 90 - 90 + "px";
      return winHeight;
    }
  },
  mounted() {
    this.makeHeight();
    const that = this;
    window.onresize = () => {
      return (() => {
        // window.screenWidth = document.body.clientWidth
        // that.screenWidth = window.screenWidth
        this.makeHeight();
      })();
    };
  }
};
</script>